<template>
  <div class="content_card">
    <UHeader v-if="this.$route.name==='BusinessPage' ">
      <template slot="left">
        <el-input
          size="small"
          style="width: 200px"
          placeholder="请输订单编号">
          <i slot="prefix" class="el-input__icon el-icon-search"/>
        </el-input>
        <StatusTab :datas="statusData" style="margin-right: 15px"/>
      </template>
      <div slot="right">
        <el-button type="success" size="mini" @click="showDialog=true">添加</el-button>
      </div>
    </UHeader>
    <router-view/>
    <UTable ref="mTable" :search-api="search" :config="config" :columns="columns" @onHandleClick="onHandleClick" />

    <el-dialog :visible.sync="showDialog" :append-to-body="true" title="企业入驻" width="700px">
      <el-form :model="editForm" label-width="100px">
        <el-container direction="horizontal">
          <el-form-item label="企业名称" >
            <el-input v-model="editForm.companyName" autocomplete="off" placeholder="请输入企业名称"/>
          </el-form-item>
          <el-form-item label="法人代表" >
            <el-input v-model="editForm.legalPerson" autocomplete="off" placeholder="请输入法人代表"/>
          </el-form-item>
        </el-container>
        <el-container direction="horizontal">
          <el-form-item label="电话">
            <el-input v-model="editForm.phone" autocomplete="off" placeholder="请输入联系电话"/>
          </el-form-item>
          <el-form-item label="E-Mail">
            <el-input v-model="editForm.email" autocomplete="off" placeholder="请输入E-Mail"/>
          </el-form-item>
        </el-container>
        <el-container direction="horizontal">
          <el-form-item label="折扣">
            <el-input v-model="editForm.discount" autocomplete="off" placeholder="请输入折扣"/>
          </el-form-item>
        </el-container>

        <el-form-item label="地址">
          <el-input v-model="editForm.compaynAddress" autocomplete="off" placeholder="请输入地址信息"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showDialog = false">取 消</el-button>
        <el-button :loading="isSaveLoadin" type="primary" @click="saveBusiness">确 定</el-button>
      </div>
    </el-dialog>
  </div>

</template>
<script>
import UHeader from '@/components/UHeader'
import UTable from '@/components/UTable'
import StatusTab from '@/components/StatusTab'
import { search, edit, changeStatus } from '@/api/business'
import columns from './columns'
export default {
  components: {
    UTable, StatusTab, UHeader
  },
  data() {
    return {
      search: search,
      editForm: {

      },
      isSaveLoadin: false,
      showDialog: false,
      config: { rowClassName: function({ row, rowIndex }) {
        if (row.status === '2') {
          return 'error-row'
        }
      } },
      statusData: [{ value: '', label: '全部' }, { value: 0, label: '正常' }, { value: 1, label: '黑名单' }],
      columns: columns
    }
  },
  mounted() {
    debugger
  },
  methods: {
    onHandleClick(butIndex, row, rowIndex) {
      switch (butIndex) {
        case 0:
          this.$router.push({ name: 'BusinessInfo', params: { companyId: row.companyId }})
          break
        default :
          changeStatus(row.companyId).then(res => {
            this.$message({
              message: '操作成功',
              type: 'success'
            })
            this.$refs.mTable.refresh()
          })
          break
      }
    },
    saveBusiness() {
      edit(this.editForm).then(res => {
        this.$message({
          message: '操作成功',
          type: 'success'
        })
        this.isSaveLoadin = false
        this.showDialog = false
        this.$refs.mTable.refresh()
      })
        .catch(_ => {
          this.isSaveLoadin = false
        })
    }
  }
}
</script>

<style scoped>

</style>
